<?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE html PUBLIC  "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
 <meta name="keywords" content="W3C SVG 1.1 Test Suite testsuite mobile"/>
 <meta name="description" content="W3C SVG 1.1 Test Suite"/>
 <title>
SVG 1.1 test:struct-dom-01-b </title>
 <style type="text/css">
 <!--
 body { font-family: "Lucida Grande", verdana, helvetica, sans-serif; line-height: 1.3; text-align: left; margin-top: 0; margin-bottom: 0 }
 .pageTitle { line-height: 1.5; font-weight: bold; margin-bottom: 1em;}
 .pageSubTitle  { color: blue; font-size: 200%; font-weight: bold }
 .openChapter { color: blue; line-height: 1.3; font-weight: bold }
 .openSection { color: blue; line-height: 125%; font-weight: bold }
 .info { color: black; line-height: 1.2; font-size: 90%; }
 p { margin-top:0; margin-bottom:0; padding-top:0; padding-bottom:0 }
 .linkbar { text-align: center; margin: 1em 1em 0.25em 1em;}
 blockquote { margin-top:0; margin-bottom:0; padding-top:0; padding-bottom:0 }
 .opscript {margin-left: 3%; margin-right: 3%; }
 .opscript p { margin-top: 0.7em}
 .navbar {background: black; color: white; font-weight: bold}
 -->
 </style>
 </head>
 <body class="bodytext">

	<div class="linkbar"> 
<p>
<a href="full-struct-dom-01-b.html">Full version</a>, <a href="basic-struct-dom-01-b.html">Basic version</a></p>
<p>Specification link: <a target="spec" href="http://www.w3.org/TR/SVG11/struct.html#core-att-mod">5.11 DOM interfaces</a></p>
 <p>
				<a href="full-script-handle-04-b.html">script-handle-04-b ←</a> 
				<a href="full-index.html">index</a>
				<a href="full-struct-dom-02-b.html">→ struct-dom-02-b</a>
						</p></div>

	<table align="center" border="0" cellspacing="0" cellpadding="10">
		<tr>
			<td align="center" colspan="3">
				<table border="0" cellpadding="8">
					<tr>
						<td align="center" colspan="2" class="pageTitle">
							<h1>struct-dom-01-b</h1>
						</td>
					</tr>
					<tr  class="navbar">
						<td align="center">
							SVG Image
						</td>
						<td align="center">
							PNG Image
						</td>
					</tr>
					<tr>
						<td align="right">
   	    		  			
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
            codebase="" id="mySVGViewerObj" width=480 height=360>
    <param name=movie value="../SvgViewer.swf">
    <param name="FlashVars" value="sourceType=url_svg&svgURL=../svggen/struct-dom-01-b.svg">
    <param name="wmode" value="transparent">
    <embed play=false name="mySVGViewerObj" 
	    src="../SvgViewer.swf" quality=high wmode="transparent"
	    width=480 height=360 type="application/x-shockwave-flash"
	    FlashVars="sourceType=url_svg&svgURL=../svggen/struct-dom-01-b.svg">
    </embed >
</object>
						</td>
						<td align="left">
							<img alt="raster image of struct-dom-01-b" src="../png/full-struct-dom-01-b.png" width="480" height="360"/>
						</td>
					</tr>
				</table>
			</td>
		</tr>
	</table>

               
<div class="opscript">
			<p>Verify the basic capability to handle the SVG DOM API. The test is composed of a top
			level svg element with an 'onload' event handler and a rect element. Both
			the svg and the rect elements have an identifier. The 'onload' handler
			invokes SVG-specific DOM API methods which use these identifiers.
			</p>
			<p>First, the handler gets the SVG element owner of the rect element and checks it has
			the expected identifier. Then, the handler accesses the coordinates of the rect element
			and uses them to build a 'shadow' rectangle under the existing one. Finally, the 'shadow'
			rectangle is created using the SVGSVGElement's createSVGRect method.
			</p>
			<p>If an implementation supports the ECMA Script DOM binding for SVG, then the image
			should show the following text: "This document's root identifier is: svg-root" and
			a red rectangle with a black shadow rectangle. Otherwise, only a red rectangle will show.
			</p>
			<p>The rendered picture should match the reference image.</p>

		</div>
<div class="linkbar"> <p>
				<a href="full-script-handle-04-b.html">script-handle-04-b ←</a>
				<a href="full-index.html">index</a>
				<a href="full-struct-dom-02-b.html">→ struct-dom-02-b</a>
						</p></div>
</body>
</html>
